function renderSystemTable(data) {
  return `
    <table class="table table-striped table-bordered">
        <tr>
          <th scope="row">Uptime</th>
          <td>${data.uptime}</td>
        </tr>
        </table>
          <p scope="col">RAM/SWAP in KB</p>
    <table class="table table-striped table-bordered">
        <tr>
          <th colspan="2" style="width: 50%;">Ram</th>
          <th colspan="2" style="width: 50%;">Swap</th>
        </tr>
        <tr>
          <th scope="row">Total ram</th>
          <th >Free ram</th>
          <th >Total swap</th>
          <th>Free swap </th>
        </tr>
        <tr>
          <td>${data.ram.totalram}</td>
          <td>${data.ram.freeram}</td>
          <td>${data.ram.totalswap}</td>
          <td>${data.ram.freeswap}</td>
        </tr>
    </table>
    <p scope="col">CPU</p>
    <table class="table table-striped table-bordered">
        <tr>
          <th scope="row">Busy</th>
          <th >CpuUsage(%)</th>
          <th >Total</th>
        </tr>
        <tr>
          <td >${data.cpu.busy}</td>
          <td >${data.cpu.cpuusage}</td>
          <td >${data.cpu.total}</td>
        </tr>
    </table>
    <p scope="col">HDD in GB</p>
    <table class="table table-striped table-bordered">
        <tr>
          <th scope="row">Path</th>
          <th >All</th>
          <th >Used</th>
          <th >Free</th>
        </tr>
        ${data.hdd.map(elem => {return renderHddRaw(elem)})}
    </table>
  `
}


function renderHddRaw(element){
    return `
      <tr>
        <td>${element.path}</td>
        <td>${element.allhdd}</td>
        <td>${element.usedhdd}</td>
        <td>${element.freehdd}</td>
      </tr>
    `
}